<!-- 高德地图，key为演示作用，请勿滥用-->
<script src="https://webapi.amap.com/maps?v=1.4.15&key=0e8a587317998a5e03cf608649b229d6&plugin=AMap.Autocomplete"></script>

<div class="layui-fluid layui-anim admin-anim" id="admin-map-demo" lay-title="高德地图">
    <div class="layui-row admin-container">
        <div class="layui-card">
            <div style="padding: .1rem;">
                <div id="container" class="map"></div>
            </div>
        </div>
    </div>
</div>

<script data-th-inline="javascript" type="text/javascript">
    setTimeout(function () {
        layui.use(['jquery', 'admin'], function () {
            var $ = layui.jquery,
                admin = layui.admin,
                $view = $('#admin-map-demo');

            $view.find('#container').css({"height": document.documentElement.clientHeight - 97 + 'px'});

            var map = new AMap.Map("container", {
                resizeEnable: true,
                zoom: 14 //初始地图级别
            });

            function currentLocationInfo() {
                map.getCity(function (info) {
                    admin.alert.success('当前位置：' + info.province + '，' + info.city + '，' + info.district + '，区号：' + info.citycode);
                });
            }

            currentLocationInfo();

            //为地图注册click事件获取鼠标点击出的经纬度坐标
            map.on('click', function (e) {
                admin.alert.success('经度：' + e.lnglat.getLng() + '，纬度：' + e.lnglat.getLat());
            });
        });
    }, 3e3)

</script>